/******************************************************************************************
 * Import
 ******************************************************************************************/

// module
import Taro, { Component } from '@tarojs/taro'
import { Swiper } from '@tarojs/components'
import { AtActionSheet, AtActionSheetItem, AtFloatLayout } from "taro-ui"

// project
import { CPage, CContent, CHeader, CFooter, CFloat, CAround, CBetween, CCenter, CRow, CWrap, CLine, CHand, CItemX, CItemY, CText, CLabel, CSvg, CImage, CButton, CColumn } from '../../library/comp';
import { Base64, Gen, Time, Zip, Session, Storage, Toast} from '../../library/func';
import Icon from '../../project/style/icon';
import Http from '../../project/func/http/http'

// 引用组件
import { Addcbtn, Cbtn, Chead, Destop, Editcunit, Ibottom, Ibottomp, Listunitone, Listunittwo, LogoLine, LogoLinep, Tabheader } from '../../project/comp'

/******************************************************************************************
 * Export Class
 ******************************************************************************************/

export default class HomeIndex extends Component {

	constructor(props) {
		super(props);

		/**
		 * state
		 */
		this.state = {
			data:{},
			system:{},
			input_show:false,

            set_show:false,

			post_data:{
				set_name:'',
				set_mobile:'',
			},

			// 获取屏幕高度
			scrollHeight: wx.getSystemInfoSync().windowHeight
		}
	}
	/*------------------------------------------------------------------------------------
	 * 声明周期
	 *-----------------------------------------------------------------------------------*/
	//获取信息
	getdata(id, callback){

		Http.AuthOk((res)=>{
			this.setState({
				is_master:res
			})
		})



		Http.Loading({
            url:'/activity/detail.php',
            data:{
                id:id,
            },
			success:(res)=>{
				this.setState({
                    data:res,
				})
				if(callback){
					callback();
				}
			}
		})

		Http.Loading({
			url:'/home/home.php',
			success:(res)=>{
				this.setState({
					system:res.system['object'],
				}, ()=>{
					console.log(this.state)
				})
			}
		})

	}

	componentWillMount () {
		this.getdata(this.$router.params.id);
	}	

    componentDidMount() {
		this.getdata(this.$router.params.id);
    }

	componentDidShow(){
		this.getdata(this.$router.params.id);
	}

	
	// onRedirect
	onRedirect(url){
		wx.redirectTo({
			url: url
		})
	}	

	// onNavigate
	onNavigate(url){
		wx.navigateTo({
			url: url
		})
	}

	//onNavigateBack
	onNavigateBack(num=1){
		wx.navigateBack({
			delta: num
		})                    
	}
	

	//申请报名
	onApply(){
		this.setState({
			input_show:true,
		})

	}

	//关闭输入框
	closeShow(){
		this.setState({
			input_show:false,
		})
	}

	// 输入提交表单的数据
	onInput(field,e){
		let post_data = this.state.post_data;
		post_data[field] = e.detail.value;
		this.setState({
			post_data: post_data,
		})
	}

	//提交申请的方法
	onsubmit(){
		let post_data = this.state.post_data;
		if(post_data['set_mobile'] == "" || post_data['set_name'] == ""){
			Toast.error("需填写完整");
		}
		post_data['fk_activity_id'] = this.state.data.id;

		Http.post({
			url:'activity/logic/apply.php',
			data:post_data,
			success:(res)=>{
				this.getdata(this.state.data.id, ()=>{
					Toast.success("提交成功");
					this.closeShow();	
				})
			},
			error:(res)=>{
				this.getdata(this.state.data.id, ()=>{
					Toast.text(res.msg);
					this.closeShow();
				})
			}
		})

	}

    //打开操作
    onDosome(){
        this.setState({
            set_show:true,
        })
    }

    //取消操作
    onCancel(){
        this.setState({
            set_show:false,
        })
    }

       //删除
	delete(){
        Http.post({
            url:'activity/logic/delete.php',
            data:{
                id: this.state.data.id,
            },
            success:(res)=>{
                Toast.success("删除成功");
                setTimeout(()=>{
                    this.onNavigateBack();
                },500)
            }
        })
    }


 
    /*------------------------------------------------------------------------------------
	 * 自定义方法
	 *-----------------------------------------------------------------------------------*/
	config = {
		navigationBarTitleText: '活动'
	}

	/**
	 * 渲染
	 */
	render() {

		// 渲染
		return (
			<CPage>

                {
                    this.state.is_master ?
                    <Chead onDosome={ this.onDosome }></Chead>
                    :
                    <view></view>
                }
                {
                    this.state.is_master ?
                    <CHand class="f1" h="50"></CHand>
                    :
                    <view></view>
                }



				<CContent mb='50'>

					{/* 活动详情引用组件 */}
					<Destop data={ this.state.data }></Destop>

					{/* 商家信息 */}
					<LogoLinep
					setname={ this.state.system.set_name }
					setlogo={ this.state.system.set_logo }
					setdescription={ this.state.system.set_description }
					></LogoLinep>

					{/* 活动内容 */}
					<CColumn bg='#fff' pa='15'>



                        {
                            this.state.data.object.set_content.map((item, key) => {
                                return(  
                                    
                                    item.type=="image"?
                                    <CHand py='20'>
										<image src={ item.content } style="width:690rpx"  mode="widthFix"/>
                                    </CHand>
                                    :
                                    item.type=="text"?
                                    <CHand size='16' color='#9b9b9b' lh='26'>
                                    { item.content }
                                    </CHand>
                                    :
                                    <CHand py='20'>
                                        <video style="width:680rpx; height:340rpx;" src={ item.content }  enable-danmu danmu-btn controls></video>
                                    </CHand>
                                
                                )
                                
                            })
                        }




					</CColumn>

				</CContent>
				{/* 底部 */}

				{
					Math.round(new Date() / 1000) < this.state.data.time_end ?
					<Ibottomp 
					enrollmentBool={ this.state.data.apply  }
					onApply={ this.onApply }
					></Ibottomp>
					:
					<view></view>
				}

				<AtFloatLayout
                    isOpened = {this.state.input_show}
                    title='提交报名'
                    onClose={ this.closeShow } 
                >

                    <CColumn h='400' bg='#fff'>
						<CText mt="20">姓名:</CText>
                        <Input
                            style='border-bottom:1px solid #f0f0f0; height:40px; width:100%'
							onInput = {this.onInput.bind(this, 'set_name')}
                        />
						<CText mt="20">电话:</CText>
                        <Input
                            style='border-bottom:1px solid #f0f0f0; height:40px; width:100%'
							onInput = {this.onInput.bind(this, 'set_mobile')}
                        />

                        <CButton bg='#debf46' color='#fff' mt='20' w='300' x='center' y='center' ml='37.5' h='40' ra='10' style='font-size:30rpx;' onClick={ this.onsubmit }>提交</CButton>

                    </CColumn>

                </AtFloatLayout>

                <AtActionSheet isOpened={ this.state.set_show }  onClose={this.onCancel} cancelText='取消' title="操作">
					{/* <AtActionSheetItem>
						<CItemX x='center' y='center' onClick={this.onNavigate.bind(this, '/screen/activity/set?id='+ this.state.data.id)}>
						<CSvg icon={Icon.edit} w='25' h='25' color='#7b7b7b' mr='6'></CSvg>
						<CText size='16' color='#2e2e2e'>编辑</CText>
						</CItemX>
					</AtActionSheetItem> */}

					<AtActionSheetItem onClick={ this.delete }>
						<CItemX x='center' y='center'>
						<CSvg icon={Icon.lajit} w='20' h='20' color='#7b7b7b' mr='6'></CSvg>
						<CText size='16' color='#2e2e2e'>删除</CText>
						</CItemX>
					</AtActionSheetItem>

					<AtActionSheetItem>
						<button plain style="border:none" open-type="share">

						<CItemX x='center' y='center'>
						<CSvg icon={Icon.share} w='20' h='20' color='#7b7b7b' mr='6'></CSvg>
						<CText size='16' color='#2e2e2e'>分享</CText>
						</CItemX>
						</button>
					</AtActionSheetItem>

				</AtActionSheet>

			</CPage>
		);
	}
};